<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>百度</title>
</head>
<style>
     body{
                background: #ffff;
            }
            *{
                margin: 0px;
                padding: 0px;
                list-style: none;
            }
            .a{
                height: 50px;
                 /* background: red;  */
            }
            .a .a1  li{
                float: right;
                padding-top:15px ;
                padding-left: 15px;
                margin-right: 10px;
            }
            .b{
                
                position: relative;
                height: 40%;
                min-height: 214px;
                max-height: 510px;
                width: auto;
                margin: 0 auto;
                 /* background: yellow;    */
             }
             .b .b1{
                 width: 639px;
                 height: 215px;
                 /* background: green;   */
                 margin-left: auto;
                 margin-right: auto;
                 margin-top: 69px;

             }
             .b .b2{
                width: 654px;
                height: 100%;
                margin: 0 auto;
                text-align: left;
                z-index: 100;
             }
               .b .b3 {
                   width: 503px;
                   height: 137px;
                   margin-left: auto;
                   margin-right: auto;

                 /* background: hotpink;   */
               }
               .b .b6{
                position: relative;
                width: 546px;
                /* background: hotpink; */
               }
             .b4 input {
                border:1px solid red;
                /* 去除鼠标点击上去的颜色 */
                outline: none; 
                height: 35px;
                width: 488px;
                margin-top: 30px;
                margin-left:-100px ;
               }
              .b .b3 img{
                  width: 209px;
                  height: 67px;
                  margin-top: 50px;
                  margin-left: 95px;
              }
              
              .b .b5{
                display: inline-block; 
              }
            .b .b6{
                cursor: pointer;
                width: 108px;
                height: 41px;
                padding: 0px;
                background: 0 0;
                background-color:#4e6ef2 ;
                border-radius:0 10px 10px 0 ;
                font-size: 17px;
                color: #fff;
                box-shadow: none;
                font-weight: 400;
                border: none;
                outline: 0;
            }
            .b input {
            outline: 0;
            -webkit-appearance: none;
            }
            .c{
               width: 155px;
               height: 60px;
               margin-left: auto;
               margin-right: auto;
               /* background: red;  */
               margin-top: 150px;
            }
            .c span{
             color: skyblue;
            }
            .d{
                width: 500px;
                height: 18px;
                /* background: #4e6ef2; */
                margin-top: 30px;
                margin-left: auto;
                margin-right: auto;
            } 
            .d li{
                float: left;
                font-size: 12px;
                padding-left: 20px;
                margin-right: 10px;

            }
            .e{
                width: 700px;
                height: 18px;
                /* background: #4e6ef2; */
                margin-top: 1px;
                margin-left: auto;
                margin-right: auto;
            } 
            .e li{
                float: left;
                font-size: 12px;
                padding-left: 20px;
                margin-right: 10px;

            }
</style>

<body>
    <div class="a">
        <ul class="a1">
            <li>
                <span>更多产品</span>
            </li>
            <li>
                <span>设置</span>
            </li>
            <li>
                <span>登录</span>
            </li>
            <li>
                <span>贴吧</span>
            </li>
            <li>
                <span>视频</span>
            </li>
            <li>
                <span>地图</span>
            </li>
            <li>
                <span>hao123</span>
            </li>
            <li>
                <span>新闻</span>
            </li>
            <li>
                <span>糯米</span>
            </li>
            
        </ul>
    </div>
    <div class="b">
         <div class="b1">
             <div class="b2">
               
            <div class="b3">

              <img src="44.png" alt="">
              
              <form action="">
                <span class="b4">
               <label for="user"></label><input class="bs" type="text" autofocus id="user">
            </span>
               <span class="b5">
              <input id="su"  type="text" value="百度一下" class="b6">
               </span>
              </form>
               </div>
             </div>
         </div>
    </div>
    <div class="c">
        <div>
            <ul>
            <img src="99.png" alt="">
        </ul>
        <ul>
            <span>手机百度</span>
        </ul>
        </div>
    </div>
    <div class="d">
        <ul>
              <li><samp>把百度设为主页</samp></li>
              <li><samp>关于百度</samp></li>
              <li><samp>About Baidu</samp></li>
              <li><samp>百度推广</samp></li>
    
            
        </ul>
    </div>
    <div class="e">
        <div>
            <ul>
                <li><samp>©2018 baidu</samp></li>
              <li><samp>使用百度前必读</samp></li>
              <li><samp>意见反馈</samp></li>
              <li><samp>京ICP证030173号</samp></li>
              <li><samp>京公网安案1100000002000001号</samp></li>
            </ul>
        </div>
    </div>
</body>
</html>